<template>
  <div class="cityedit">
    <el-dialog
      :title="text"
      :visible.sync="dialogCity"
      width="40%">
      <el-form :model="form" ref="form" size="medium" label-width="120px">
        <el-form-item label="上级名称:" prop="superior_name">
          <el-input v-model="form.superior_name" placeholder="请输入上级名称"></el-input>
        </el-form-item>
        <el-form-item label="名称:" prop="area_name">
          <el-input v-model="form.area_name" placeholder="请输入名称"></el-input>
        </el-form-item>
        <el-form-item label="合并名称:" prop="merge_name">
          <el-input v-model="form.merge_name" placeholder="格式:陕西,西安,雁塔"></el-input>
        </el-form-item>
        <el-form-item label="区号:" prop="area_code">
          <el-input v-model="form.area_code" placeholder="请输入区号"></el-input>
        </el-form-item>
        <el-form-item label="经度:" prop="longitude">
          <el-input v-model="form.longitude" placeholder="请输入经度"></el-input>
        </el-form-item>
        <el-form-item label="纬度:" prop="latitude">
          <el-input v-model="form.latitude" placeholder="请输入纬度"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="save">保 存</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name:'CityEdit',
    props:{
      rows: {}
    },
    data() {
      return {
        text: '',
        dialogCity: false,
        form: {
          superior_name: '',
          area_name: '',
          merge_name: '',
          area_code: '',
          longitude: '',
          latitude: ''
        }
      }
    },
    methods: {
      //打开弹窗-编辑
      openEdit() {
        this.dialogCity = true;
        this.text = "编辑城市"
        this.form = {
          superior_name: this.rows.superior_name,
          area_name: this.rows.area_name,
          merge_name: this.rows.merge_name,
          area_code: this.rows.area_code,
          longitude: this.rows.longitude,
          latitude: this.rows.latitude
        }
        console.log('form',this.form)
      },
      //打开弹窗-新增
      openAdd() {
        this.dialogCity = true;
        this.text = "添加城市"
      },

      //保存
      save () {
        this.$refs['form'].validate(valid => {
          if (valid) {
            console.log('form1',this.form)
            this.dialogCity = false;
            this.form = {
              superior_name: '',
              area_name: '',
              merge_name: '',
              area_code: '',
              longitude: '',
              latitude: ''
            };
            console.log('form2',this.form)
            this.$message.success('保存成功')
          } else {
            this.$message.error('表单验证失败!')
          }
        })
      },

      //关闭
      close() {
        this.dialogCity = false;
        this.form = {
          superior_name: '',
          area_name: '',
          merge_name: '',
          area_code: '',
          longitude: '',
          latitude: ''
        }
      }
    }
  }
</script>

<style>
</style>
